<template>
    <div>
        <div class="abc"></div>
        <div class="item">
            我是交运报表
        </div>
        <div id="chartWrap"></div>
    </div>
</template>

<script>
import Vue from 'vue'

import { Group, Cell, Loading, XButton, XDialog, Actionsheet, Divider } from 'vux'
import { WechatPlugin, ToastPlugin } from 'vux'
import { AlertPlugin, ConfirmPlugin } from 'vux'

import axios from '@/api/axios'
import api from '@/api/base.api'
import { Grid, GridItem } from 'vux'

var echarts =require('echarts/lib/echarts')
Vue.prototype.$echarts = echarts
export default {
    components: {
        Grid,
        GridItem
    },
    mounted() {

    },
    data() {
        return {
            msg: 'Hello World!',
            showD: false,
            showAs: false,
            menus8: {
                menu1: 'Close me',
                menu2: 'Close me'
            }
        }
    },
    methods: {
        draw() {
            this.$echarts.showLoading();
            var myChart = this.$echarts.init(document.getElementById('chartWrap'));
            // 绘制图表
            myChart.setOption({
                title: { text: '在Vue中使用echarts' },
                tooltip: {},
                xAxis: {
                    data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
                },
                yAxis: {},
                series: [{
                    name: '销量',
                    type: 'bar',
                    data: [5, 20, 36, 10, 10, 20]
                }]
            });
        }
    }
}
</script>

<style lang="less">
.item {
    //width:100%;
    width: 5rem;
    background: #fc0;
}
</style>
